﻿<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>注册</title>
    <!-- 引入 mui -->
    <link rel="stylesheet" type="text/css" href="../CCMobile/css/mui.css" />

    <!-- 自定义样式 -->
    <link rel="stylesheet" type="text/css" href="../CCMobile/css/index2.css" />
    <script src="../CCMobile/js/jquery.min.js" type="text/javascript"></script>

    <script src="../CCMobile/js/jquery.js" type="text/javascript"></script>
    <script src="../CCMobile/Scripts/config.js" type="text/javascript"></script>
    <script src="../CCMobile/Comm/Gener.js" type="text/javascript"></script>
    <script src="../CCMobile/Scripts/QueryString.js" type="text/javascript"></script>

</head>
<style>
    html, body {
        position: fixed; /*  */
        overflow-x: hidden;
        background-size: 100% 100%;
        background-repeat: no-repeat;
        background-position: center;
        background-image: url('../CCMobile/image/register.png');
        min-height: 100%;
    }

    .au-form-box {
        /* margin: 0 auto; */
        padding: 0 1.5rem;
        /*padding-top: 7rem;*/
    }

    .au-form-item {
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        box-sizing: border-box;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        flex-direction: column;
        padding: 0.9375rem 0;
        font-size: 16px;
        line-height: 32px;
    }

    .au-field-inner {
        margin: 10px 0;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        align-items: center;
    }

        .au-field-inner > div:first-of-type {
            min-width: 4.5rem;
            color: #212121;
        }

    .au-fild-body {
        height: 1.5625rem;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        flex: 1;
        -webkit-box-align: center;
        -webkit-align-items: center;
        align-items: center;
        padding: 0 0.625rem;
    }

    input[type='text'],
    input[type='password'],
    .au-input-input {
        border: none;
        outline: none;
        display: block;
        height: 100%;
        background: none;
        color: inherit;
        opacity: 1;
        -webkit-text-fill-color: currentcolor;
        font: inherit;
        line-height: inherit;
        letter-spacing: inherit;
        text-align: inherit;
        text-indent: inherit;
        text-transform: inherit;
        text-shadow: inherit;
        width: 100%;
    }

    .au-size-mini {
        display: flex;
        align-items: center;
        width: auto;
        height: 21px;
        padding-top: 0.0625rem;
        border-left: 0.0625rem solid #e5e5e5;
        padding: 0 0.625rem;
        color: #999;
    }

    .au-btn {
        margin-top: 1.25rem;
        position: relative;
        border: 0px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        padding: 0 0.9375rem;
        font-size: 0.75rem;
        font-weight: bold;
        min-height: 2rem;
        line-height: 1;
        text-align: center;
        text-decoration: none;
        overflow: visible;
        margin-left: initial;
        transform: translate(0px, 0px);
        margin-right: initial;
        border-radius: 0.1875rem;
    }

    .au-btn-linear {
        color: white;
        background: linear-gradient(73deg, rgba(0, 177, 255, 1), rgba(0, 137, 255, 1));
    }
</style>

<body>
    <div class="pages" id="pages">
        <header id="header" class="mui-bar mui-bar-transparent" style="background-color: rgba(247, 247, 247, 0);">
            <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left au-text-white"></a>
            <h1 class="mui-title au-text-white">注册</h1>
        </header>
        <div class="au-form-box">
            <form class="au-form-item">

                <div class="au-border-bottom au-field-inner">
                    <div><span class="required">*</span>用户名</div>
                    <div class="au-fild-body">
                        <input type="text" name="TB_No" id="TB_No" value="" class="au-input-input" placeholder="请填写登录帐号" />
                    </div>
                </div>

                <div class="au-border-bottom au-field-inner">
                    <div><span class="required">*</span>登录密码</div>
                    <div class="au-fild-body">
                        <input type="password" name="TB_Pass" id="TB_Pass" value="" class="au-input-input" placeholder="请输入位密码" />
                    </div>
                </div>



                <button type="button" id="submit" class="au-btn au-btn-linear">确认绑定</button>
            </form>

        </div>
    </div>
    <div id="loginAfter" style="font-size: 20px; padding:35px 40px">
        <div style="margin-top:20px;">
            <img src="../CCMobile/image/appbg1.jpg" style="width:100%" />
        </div>
        <div>
            用户绑定成功，以后可通过扫描二维码登录系统
        </div>

    </div>
</body>
<!-- <script type="text/javascript" src="../script/api.js"></script> -->
<link href="../CCMobile/js/mui/css/mui.picker.min.css" rel="stylesheet" />
<script src="../CCMobile/js/mui.js"></script>
<script src="../CCMobile/js/mui/js/mui.min.js"></script>
<script src="../CCMobile/js/mui/js/mui.picker.min.js"></script>
<script type="text/javascript">
    $(function () {

        mui.init({
            //禁用mui tap监听 否则点击选择会弹出两次
            gestureConfig: {
                tap: false
            }
        });

        var btn = document.getElementById("submit");
        $("#loginAfter").hide();
        //监听点击事件
        btn.addEventListener("tap", function () {
            //1.表单验证
            var userNo = $("#TB_No").val();
            if (userNo == null || userNo == '') {
                mui.toast('请输入用户名！', { duration: 'short', type: 'div' });
                return;
            }

            var pass = $("#TB_Pass").val();
            if (pass == null || pass == '') {
                mui.toast("请输入密码！", { duration: 'short', type: 'div' });
                return;
            }
            var openid = GetQueryString("OpenID");
            //2.注册
            var handler = new HttpHandler("BP.WF.HttpHandler.CCMobile");
            handler.AddPara("TB_No", userNo);
            handler.AddPara("TB_Pass", pass);
            handler.AddPara("OpenID", openid);
            var data = handler.DoMethodReturnString("Register_User");
            if (data.indexOf('err@') == 0) {
                mui.alert(data);
            }
            else {
                //mui.alert("用户注册成功。");
                $("#pages").hide();
                $("#loginAfter").show();
            }
        });
    })



</script>
</html>
